<template>
  <div class="card text-center">
    <div class="card-body pb-1">
      <div style="width: 64px;display: inline-block;">
        <!-- <div class="zoomImage" v-lazy:background-image="ec.basicThumbnails"></div> -->
        <img :src="ec.basicThumbnails" alt="" class="img-fluid">
      </div>
      <h5 class="card-title">{{ec.basicTitle}}</h5>
      <el-row style="margin-bottom: 5px;">
        <el-col :span="24" style="white-space: nowrap;min-height: 32px;">
          <el-tag class="mr-3 fz-15" type="success" v-for="tag in removeTags(ec.tags)" :key="tag.tagId">{{tag.tagName}}</el-tag>
        </el-col>
      </el-row>
    </div>
    <div class="card-footer p-0">
      <div class="container">
        <div class="row">
          <div class="col-4 border-right">
            <p class="m-1 color-self-green1">{{ec.browseNumber}}</p>
            <p class="m-1 text-muted">浏览</p>
          </div>
          <div class="col-4 border-right">
            <p class="m-1 color-self-green1">{{ec.likeNumber}}</p>
            <p class="m-1 text-muted">浏览</p>
          </div>
          <div class="col-4">
            <p class="m-1 color-self-green1">{{ec.comments}}</p>
            <p class="m-1 text-muted">浏览</p>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: "eccard",
  title: "一条企业信息",
  data () {
    return {
      ec: {}
    }
  },
  props: {
    data: {
      type: Object
    }
  },
  mounted () {
    this.assignObj()
  },
  methods: {
    assignObj () {
      this.ec = Object.assign({}, this.data)
      if (this.ec.tags && typeof this.ec.tags === 'string') {
        this.ec.tags = JSON.parse(this.ec.tags)
      }
    },
    removeTags (str) {
      let tags = []
      if (str && typeof str === 'string') {
        tags = JSON.parse(str)
      }
      // 30
      let newTag = []
      let len = 0
      if (tags) {
        for (var i = 0; i < tags.length; i++) {
          len = len + tags[i].tagName.length + 2
          if (len < 30) {
            newTag.push(tags[i])
          }
        }
      }
      return newTag
    }
  },
  watch: {
    'info': {
      handler () {
        this.assignObj()
      },
      deep: true
    }
  }
}
</script>

<style lang="less">
</style>
